<template>
    <div>
        <H1>{{message}}</H1>
        <div :title="message">{{name}}</div>
        <input @keyup.enter="enter()" v-model="name">
        <el-button type="primary" @click="goto">Go!</el-button>
    </div>
</template>
<script lang="ts">
    export default {
        name: "GoodBye",
        data() {
            return {
                name: "蔡徐坤",
                age: 25
            }
        },
        props: {
            message: String
        },
        methods: {
            goto:function(){
                this.$router.push('/');
            }
        },
        computed: {
            // a computed getter
            reversedMessage: function () {
                // `this` points to the vm instance
                return this.name.split('').reverse().join('')
            }
        },
        watch: {

        },
        extends: {

        },
        beforeRouteEnter: (to, from, next) => { //组件进入的路由钩子
            console.log("准备进入");
            next();
        },
        beforeRouteLeave: (to, from, next) => { //组件离开的路由钩子
            console.log("准备离开");
            next();
        }
    };
</script>
<style scoped lang="stylus">

</style>